/* HTML5 Playground
   File: 	misc.css
   Author:	Nagendra U M
*/
@CHARSET "UTF-8";

#audioText {
	margin-left: auto;
	margin-right: auto;
	font-family: Courier New, monospace;
	font-size: 16px;
	color: blue;
	text-align: center;
	width: 100%;
	display: none;
}

#pageVisibilityAudio {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

#outerDiv {
	vertical-align: middle;
	position: relative;
	text-align: center;
	width: 640px;
	height: 400px;
	border: threeddarkshadow;
	border-color: black;
	border-style: groove;
}

.default {
	position: relative;
	top: 25%;
	vertical-align: middle;
	margin-top: auto;
	margin-bottom: auto;
	margin-left: auto;
	margin-right: auto;
	width: 320px;
	height: 200px;
	border: 1px solid black;
	background-color: green;
	color: yellow;
	font-family: Courier New, monospace;
	font-size: 80px;
}

.rotate {
	/* For Webkit-based browsers (Google Chrome, Apple Safari) */
	-webkit-animation-name: rotate; 
    -webkit-animation-duration: 1s; 
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
	
	/* For Mozilla Firefox */
	-moz-animation-name: rotate; 
    -moz-animation-duration: 1s; 
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
}

/* For Webkit-based browsers (Google Chrome, Apple Safari) */
@-webkit-keyframes rotate {
	from {
    	-webkit-transform: rotate(0deg);
	}
	to { 
		-webkit-transform: rotate(360deg);
	}
}

/* For Mozilla Firefox */
@-moz-keyframes rotate {
	from {
    	-moz-transform: rotate(0deg);
	}
	to { 
		-moz-transform: rotate(360deg);
	}
}

.fade-out {
	opacity: 1;
	transition: opacity 4s ease-in-out;
	-moz-transition: opacity 4s ease-in-out;
	-webkit-transition: opacity 4s ease-in-out;
}

.fade-in {
	opacity: 0.0;
	transition: opacity 4s ease-in-out;
	-moz-transition: opacity 4s ease-in-out;
	-webkit-transition: opacity 4s ease-in-out;
}

.box-transform {
	-webkit-box-shadow: rgba(0, 0, 0, 0.199219) 0px 10px 0px 0px;
	border-radius: 18px;
	-moz-border-radius: 18px;
	-webkit-border-radius: 18px;
	border-bottom-color: #333;
	text-shadow: #FE6 0px 5px 0px;
}